<!DOCTYPE html>
<!-- saved from url=(0047)http://www.3dgep.com/understanding-quaternions/ -->
<html lang="en-US" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#"><!--<![endif]--><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>Understanding Quaternions3D Game Engine Programming</title>
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="stylesheet" type="text/css" media="all" href="./Understanding Quaternions3D Game Engine Programming_files/style.css">
<link rel="pingback" href="http://www.3dgep.com/xmlrpc.php">
<!--[if lt IE 9]>
<script src="http://www.3dgep.com/wp-content/themes/twentyeleven/js/html5.js" type="text/javascript"></script>
<![endif]-->
 
<meta name="description" content="Quaternions are used to represent an orientation in 3D space. This article attempts to de-mystify the complexities of quaternions.">
<meta name="robots" content="noodp">
<link rel="canonical" href="./Understanding Quaternions3D Game Engine Programming_files/Understanding Quaternions3D Game Engine Programming.html">
<link rel="publisher" href="https://www.google.com/+3dgep">
<meta property="og:locale" content="en_US">
<meta property="og:type" content="article">
<meta property="og:title" content="Understanding Quaternions">
<meta property="og:description" content="Quaternions are used to represent an orientation in 3D space. This article attempts to de-mystify the complexities of quaternions.">
<meta property="og:url" content="http://www.3dgep.com/understanding-quaternions/">
<meta property="og:site_name" content="3D Game Engine Programming">
<meta property="article:publisher" content="https://www.facebook.com/3DGameEngineProgramming">
<meta property="article:tag" content="3D">
<meta property="article:tag" content="complex">
<meta property="article:tag" content="Graphics">
<meta property="article:tag" content="imaginary">
<meta property="article:tag" content="Programming">
<meta property="article:tag" content="quaternion">
<meta property="article:tag" content="rotations">
<meta property="article:tag" content="rotors">
<meta property="article:tag" content="slerp">
<meta property="article:tag" content="squad">
<meta property="article:section" content="Math">
<meta property="article:published_time" content="2012-06-25T16:00:31+00:00">
<meta property="article:modified_time" content="2014-07-15T10:37:25+00:00">
<meta property="og:updated_time" content="2014-07-15T10:37:25+00:00">
<meta property="fb:admins" content="514753860">
<meta property="og:image" content="http://www.3dgep.com/wp-content/uploads/2012/06/Understanding-Quaternions-2012-06-28-11-25-50-18.png">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:description" content="Quaternions are used to represent an orientation in 3D space. This article attempts to de-mystify the complexities of quaternions.">
<meta name="twitter:title" content="Understanding Quaternions">
<meta name="twitter:site" content="@3dgep">
<meta name="twitter:image" content="http://www.3dgep.com/wp-content/uploads/2012/06/Understanding-Quaternions-2012-06-28-11-25-50-18.png">
<meta name="twitter:creator" content="@3dgep">
 
<link rel="alternate" type="application/rss+xml" title="3D Game Engine Programming » Feed" href="http://www.3dgep.com/feed/">
<link rel="alternate" type="application/rss+xml" title="3D Game Engine Programming » Comments Feed" href="http://www.3dgep.com/comments/feed/">
<link rel="alternate" type="application/rss+xml" title="3D Game Engine Programming » Understanding Quaternions Comments Feed" href="http://www.3dgep.com/understanding-quaternions/feed/">
 
<script type="text/javascript" async="" src="./Understanding Quaternions3D Game Engine Programming_files/ga.js"></script><script type="text/javascript" data-cfasync="false">
  //<![CDATA[
    _SHR_SETTINGS = {"endpoints":{"local_recs_url":"http:\/\/www.3dgep.com\/wp-admin\/admin-ajax.php?action=shareaholic_permalink_related","share_counts_url":"http:\/\/www.3dgep.com\/wp-admin\/admin-ajax.php?action=shareaholic_share_counts_api"}};
  //]]>
</script>

 
<meta name="shareaholic:site_name" content="3D Game Engine Programming">
<meta name="shareaholic:language" content="en-US">
<meta name="shareaholic:url" content="http://www.3dgep.com/understanding-quaternions/">
<meta name="shareaholic:keywords" content="3d, complex, graphics, imaginary, programming, quaternion, rotations, rotors, slerp, squad, , math">
<meta name="shareaholic:article_published_time" content="2012-06-25T14:00:31+00:00">
<meta name="shareaholic:article_modified_time" content="2015-10-09T10:03:30+00:00">
<meta name="shareaholic:shareable_page" content="true">
<meta name="shareaholic:article_author_name" content="Jeremiah van Oosten">
<meta name="shareaholic:site_id" content="1d80af13c25f89ea33d17c6fecc01a3c">
<meta name="shareaholic:wp_version" content="7.6.1.0">
<meta name="shareaholic:image" content="http://www.3dgep.com/wp-content/uploads/2012/06/Understanding-Quaternions-2012-06-28-11-25-50-18-1024x576.png">
 
 
<meta property="og:image" content="http://www.3dgep.com/wp-content/uploads/2012/06/Understanding-Quaternions-2012-06-28-11-25-50-18-1024x576.png">
 
<script type="text/javascript">
			window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/www.3dgep.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.4.2"}};
			!function(a,b,c){function d(a){var c,d=b.createElement("canvas"),e=d.getContext&&d.getContext("2d"),f=String.fromCharCode;return e&&e.fillText?(e.textBaseline="top",e.font="600 32px Arial","flag"===a?(e.fillText(f(55356,56806,55356,56826),0,0),d.toDataURL().length>3e3):"diversity"===a?(e.fillText(f(55356,57221),0,0),c=e.getImageData(16,16,1,1).data.toString(),e.fillText(f(55356,57221,55356,57343),0,0),c!==e.getImageData(16,16,1,1).data.toString()):("simple"===a?e.fillText(f(55357,56835),0,0):e.fillText(f(55356,57135),0,0),0!==e.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag"),unicode8:d("unicode8"),diversity:d("diversity")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag&&c.supports.unicode8&&c.supports.diversity||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
		</script><script src="./Understanding Quaternions3D Game Engine Programming_files/wp-emoji-release.min.js" type="text/javascript"></script>
<style type="text/css">img.wp-smiley,img.emoji{display:inline!important;border:none!important;box-shadow:none!important;height:1em!important;width:1em!important;margin:0 .07em!important;vertical-align:-0.1em!important;background:none!important;padding:0!important;}</style>
<link rel="stylesheet" id="prettyphoto-css" href="./Understanding Quaternions3D Game Engine Programming_files/prettyPhoto.css" type="text/css" media="screen">
<link rel="stylesheet" id="mt-shcore-style-css" href="./Understanding Quaternions3D Game Engine Programming_files/shCore.css" type="text/css" media="all">
<link rel="stylesheet" id="mt-theme-style-css" href="./Understanding Quaternions3D Game Engine Programming_files/shThemeDefault.css" type="text/css" media="all">
 
<script type="text/javascript">

	var _gaq = _gaq || [];
	_gaq.push(['_setAccount', 'UA-21362652-4']);
	_gaq.push(['_gat._forceSSL']);
	_gaq.push(['_trackPageview']);

	(function () {
		var ga = document.createElement('script');
		ga.type = 'text/javascript';
		ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0];
		s.parentNode.insertBefore(ga, s);
	})();

</script>
 
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/jquery.js"></script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/jquery-migrate.min.js"></script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/shCore.js"></script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/shAutoloader.js"></script>
<link rel="https://api.w.org/" href="http://www.3dgep.com/wp-json/">
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.3dgep.com/xmlrpc.php?rsd">
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.3dgep.com/wp-includes/wlwmanifest.xml">
<meta name="generator" content="WordPress 4.4.2">
<link rel="shortlink" href="http://www.3dgep.com/?p=1815">
<link rel="alternate" type="application/json+oembed" href="http://www.3dgep.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fwww.3dgep.com%2Funderstanding-quaternions%2F">
<link rel="alternate" type="text/xml+oembed" href="http://www.3dgep.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fwww.3dgep.com%2Funderstanding-quaternions%2F&format=xml">
<style type="text/css">.wptoc{border:1px solid #AAAAAA;padding:5px;float:left;font-size:0.95em;}.wptoc h2{text-align:center;font-size:1em;font-weight:bold;}.wptoc ul,.wptoc ol{list-style:none;padding:0;}.wptoc ul ul,.wptoc ol ol{margin:0 0 0 2em;}.wptoc-end{clear:both;}</style>
 <link rel="shortcut icon" href="http://3dgep.com/wp-content/uploads/2014/03/favicon.ico">
<link rel="icon" href="http://3dgep.com/wp-content/uploads/2014/03/favicon.png" type="image/png">
<link rel="icon" href="http://3dgep.com/wp-content/uploads/2014/03/favicon.gif" type="image/gif">
<style type="text/css">.my-note{font-size:0.7em;background-color:#efefef;text-align:justify;border-style:solid none solid none;border-width:1px;margin-bottom:1.625em;}.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}</style></head>
<body class="single single-post postid-1815 single-format-standard singular two-column right-sidebar">
<div id="page" class="hfeed">
<header id="branding" role="banner">
<hgroup>
<h1 id="site-title"><span><a href="http://www.3dgep.com/" rel="home">3D Game Engine Programming</a></span></h1>
<h2 id="site-description">Helping you build your dream game engine.</h2>
</hgroup>
<a href="http://www.3dgep.com/">
<img width="1000" height="288" src="./Understanding Quaternions3D Game Engine Programming_files/Understanding-Quaternions-2012-06-28-11-25-50-18-1000x288.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Understanding Quaternions"> </a>
<form method="get" id="searchform" action="http://www.3dgep.com/">
<label for="s" class="assistive-text">Search</label>
<input type="text" class="field" name="s" id="s" placeholder="Search">
<input type="submit" class="submit" name="submit" id="searchsubmit" value="Search">
</form>
<nav id="access" role="navigation">
<h3 class="assistive-text">Main menu</h3>
<div class="skip-link"><a class="assistive-text" href="http://www.3dgep.com/understanding-quaternions/#content">Skip to primary content</a></div>
<div class="menu-main-menu-container"><ul id="menu-main-menu" class="menu"><li id="menu-item-928" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-928"><a href="http://www.3dgep.com/">Home</a></li>
<li id="menu-item-932" class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-932"><a href="http://www.3dgep.com/category/math/">Math</a></li>
<li id="menu-item-3703" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3703"><a href="http://www.3dgep.com/category/unity/">Unity</a></li>
<li id="menu-item-931" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-931"><a href="http://www.3dgep.com/category/graphics-programming/">Graphics Programming</a>
<ul class="sub-menu">
<li id="menu-item-2641" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2641"><a href="http://www.3dgep.com/category/graphics-programming/opengl/">OpenGL</a></li>
<li id="menu-item-5758" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5758"><a href="http://www.3dgep.com/category/graphics-programming/directx/">DirectX</a></li>
<li id="menu-item-2659" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2659"><a href="http://www.3dgep.com/category/graphics-programming/cg/">Cg</a></li>
</ul>
</li>
<li id="menu-item-2104" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2104"><a href="http://www.3dgep.com/category/cuda/">CUDA</a></li>
<li id="menu-item-1568" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1568"><a href="http://www.3dgep.com/about-3d-game-engine-programming/">About</a></li>
<li id="menu-item-4599" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-4599"><a href="http://www.3dgep.com/courses/">Courses</a>
<ul class="sub-menu">
<li id="menu-item-4604" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4604"><a href="http://www.3dgep.com/game-engines-1-ge1/">Game Engines 1 (GE1/GEA1)</a></li>
<li id="menu-item-4602" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4602"><a href="http://www.3dgep.com/graphics-programming-3-grp3/">Graphics Programming 3 (GRP3)</a></li>
<li id="menu-item-4601" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4601"><a href="http://www.3dgep.com/graphics-programming-4-grp4/">Graphics Programming 4 (GRP4)</a></li>
<li id="menu-item-4600" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4600"><a href="http://www.3dgep.com/advanced-game-technology-6-agt6/">Advanced Game Technology 6 (AGT6)</a></li>
</ul>
</li>
</ul></div> </nav> 
</header> 
<div id="main">
<div id="primary">
<div id="content" role="main">
<nav id="nav-single">
<h3 class="assistive-text">Post navigation</h3>
<span class="nav-previous"><a href="http://www.3dgep.com/transformation-and-lighting-in-cg-3-1/" rel="prev"><span class="meta-nav">←</span> Previous</a></span>
<span class="nav-next"><a href="http://www.3dgep.com/introduction-to-unity-3-5/" rel="next">Next <span class="meta-nav">→</span></a></span>
</nav> 
<article id="post-1815" class="post-1815 post type-post status-publish format-standard has-post-thumbnail hentry category-math tag-3d tag-complex tag-graphics tag-imaginary tag-programming tag-quaternion tag-rotations tag-rotors tag-slerp tag-squad">
<header class="entry-header">
<h1 class="entry-title">Understanding Quaternions</h1>
<div class="entry-meta">
<span class="sep">Posted on </span><a href="./Understanding Quaternions3D Game Engine Programming_files/Understanding Quaternions3D Game Engine Programming.html" title="4:00 pm" rel="bookmark"><time class="entry-date" datetime="2012-06-25T16:00:31+00:00">June 25, 2012</time></a><span class="by-author"> <span class="sep"> by </span> <span class="author vcard"><a class="url fn n" href="http://www.3dgep.com/author/jeremiah/" title="View all posts by Jeremiah van Oosten" rel="author">Jeremiah van Oosten</a></span></span> </div> 
</header> 
<div class="entry-content">
<div id="attachment_3239" style="width: 160px" class="wp-caption alignleft"><a href="http://3dgep.com/wp-content/uploads/2012/06/Understanding-Quaternions-2012-06-28-11-25-50-18.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Understanding-Quaternions-2012-06-28-11-25-50-18-150x150.png" alt="Understanding Quaternions" title="Understanding Quaternions" width="150" height="150" class="size-thumbnail wp-image-3239"></a><p class="wp-caption-text">Understanding Quaternions</p></div>
<p>In this article I will attempt to explain the concept of Quaternions in an easy to understand way. I will explain how you might visualize a Quaternion as well as explain the different operations that can be applied to quaternions. I will also compare applications of matrices, euler angles, and quaternions and try to explain when you would want to use quaterions instead of Euler angles or matrices and when you would not.</p>
<p><span id="more-1815"></span></p>
<div style="clear: both;"><div class="toc wptoc">
<h2>Table of Contents</h2>
<ol class="toc-odd level-1">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Introduction">Introduction</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Complex_Numbers">Complex Numbers</a>
<ol class="toc-even level-2">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Adding_and_Subtracting_Complex_Numbers">Adding and Subtracting Complex Numbers</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Multiply_a_Complex_Number_by_a_Scalar">Multiply a Complex Number by a Scalar</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Product_of_Complex_Numbers">Product of Complex Numbers</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Square_of_Complex_Numbers">Square of Complex Numbers</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Complex_Conjugate">Complex Conjugate</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Absolute_Value_of_a_Complex_Number">Absolute Value of a Complex Number</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quotient_of_Two_Complex_Numbers">Quotient of Two Complex Numbers</a>
</li>
</ol>
</li><li>
<a href="http://www.3dgep.com/understanding-quaternions/#Powers_of_i">Powers of <em>i</em></a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#The_Complex_Plane">The Complex Plane</a>
<ol class="toc-even level-2">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Rotors">Rotors</a>
</li>
</ol>
</li><li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternions">Quaternions</a>
<ol class="toc-even level-2">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternions_as_an_Ordered_Pair">Quaternions as an Ordered Pair</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Adding_and_Subtracting_Quaternions">Adding and Subtracting Quaternions</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Products">Quaternion Products</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#A_Real_Quaternion">A Real Quaternion</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Multiplying_a_Quaternion_by_a_Scalar">Multiplying a Quaternion by a Scalar</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Pure_Quaternions">Pure Quaternions</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Additive_Form_of_a_Quaternion">Additive Form of a Quaternion</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Unit_Quaternion">Unit Quaternion</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Binary_Form_of_a_Quaternion">Binary Form of a Quaternion</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Conjugate">Quaternion Conjugate</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Norm">Quaternion Norm</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Normalization">Quaternion Normalization</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Inverse">Quaternion Inverse</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Dot_Product">Quaternion Dot Product</a>
</li>
</ol>
</li><li>
<a href="http://www.3dgep.com/understanding-quaternions/#Rotations">Rotations</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Interpolation">Quaternion Interpolation</a>
<ol class="toc-even level-2">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#SLERP">SLERP</a>
<ol class="toc-odd level-3">
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Difference">Quaternion Difference</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Quaternion_Exponentiation">Quaternion Exponentiation</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Fractional_Difference_of_Quaternions">Fractional Difference of Quaternions</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Considerations">Considerations</a>
</li>
</ol>
</li><li>
<a href="http://www.3dgep.com/understanding-quaternions/#SQUAD">SQUAD</a>
</li>
</ol>
</li><li>
<a href="http://www.3dgep.com/understanding-quaternions/#Conclusion">Conclusion</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Download_the_Demo">Download the Demo</a>
</li>
<li>
<a href="http://www.3dgep.com/understanding-quaternions/#Reference">Reference</a>
</li>
</ol>
</div>
<div class="wptoc-end">&nbsp;</div></div>
<div class="my-note">
<strong>DISCLAIMER</strong>: You cannot fully understand quaternions in just 45 minutes.<br>
This article is extremely math intensive and is not intended for the weak-hearted.
</div>
<span id="Introduction"><h1>Introduction</h1></span>
<p>In computer graphics, we use transformation matrices to express a position in space (translation) as well as its orientation in space (rotation). Optionally, a single transformation matrix can also be used to express the scale or “shear” of an object. We can think of this transformation matrix as a “basis space” where if you multiply a vector or a point (or even another matrix) by a transformation matrix you “transform” that vector, point or matrix into the space represented by that matrix.</p>
<p>In this article, I will not discuss the details of transformation matrices. For a detailed description of transformation matrices, you can refer to my previous article titled <a href="http://3dgep.com/?p=259" title="3D Math Primer for Game Programmers (Matrices)" target="_blank">Matrices</a>.</p>
<p>In this article, I want to discuss an alternative method of describing the orientation of an object (rotation) in space using quaternions.</p>
<p>The concept of quaterinions was realized by the Irish mathematician <a href="http://en.wikipedia.org/wiki/William_Rowan_Hamilton" title="William Rowan Hamilton" target="_blank">Sir William Rowan Hamilton</a> on Monday October 16th 1843 in Dublin, Ireland. Hamilton was on his way to the <a href="http://en.wikipedia.org/wiki/Royal_Irish_Academy" title="Royal Irish Academy" target="_blank">Royal Irish Academy</a> with his wife and as he was passing over the <a href="http://en.wikipedia.org/wiki/Royal_Canal" title="Royal Canal" target="_blank">Royal Canal</a> on the <a href="http://en.wikipedia.org/wiki/Broom_Bridge" title="Brougham Bridge" target="_blank">Brougham Bridge</a> he made a dramatic realization that he immediately carved into the stone of the bridge.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex.cgi" style="float:top;" border="0px">
</div>
<div style="width: 650px" class="wp-caption alignnone"><a href="http://en.wikipedia.org/wiki/File:William_Rowan_Hamilton_Plaque_-_geograph.org.uk_-_347941.jpg"><img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/William_Rowan_Hamilton_Plaque_-_geograph.org.uk_-_347941.jpg" title="William Rowan Hamilton Plaque - geograph.org.uk" width="640" height="480"></a><p class="wp-caption-text">William Rowan Hamilton Plaque on Broome Bridge on the Royal Canal commemorating his discovery of the fundamental formula for quaternion multiplication.</p></div>
<span id="Complex_Numbers"><h1>Complex Numbers</h1></span>
<p>Before we can fully understand quaterions, we must first understand where they came from. The root of quaternions is based on the concept of the complex number system.</p>
<p>In addition to the well-known number sets (<a href="http://mathworld.wolfram.com/NaturalNumber.html" title="Natural Number" target="_blank">Natural</a>, <a href="http://mathworld.wolfram.com/Integer.html" title="Integers" target="_blank">Integer</a>, <a href="http://mathworld.wolfram.com/RealNumber.html" title="Real Numbers" target="_blank">Real</a>, and <a href="http://mathworld.wolfram.com/RationalNumber.html" title="Rational Numbers" target="_blank">Rational</a>), the Complex Number system introduces a new set of numbers called imaginary numbers. Imaginary numbers were invented to solve certain equations that had no solutions such as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(1).cgi" style="float:top;" border="0px">
</div>
<p>To solve this expression, we must state that <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(2).cgi" style="float:top;" border="0px"> which we know is not possible because the square of any number (positive or negative) is always positive.</p>
<p>Mathematicians generally can’t accept that an expression does not have a solution so a new term was invented called the <a href="http://mathworld.wolfram.com/ImaginaryNumber.html" title="Imaginary Number" target="_blank">imaginary number</a> that can be used to solve such equations.</p>
<p>The imaginary number has the form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(3).cgi" style="float:top;" border="0px">
</div>
<p>Don’t try to actually understand this term as there is no logical reason why it exists. We just have to accept that <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(4).cgi" style="float:top;" border="0px"> is just something that squares to <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(5).cgi" style="float:top;" border="0px">.</p>
<p>The set of imaginary numbers can be represented by <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(6).cgi" style="float:top;" border="0px">.</p>
<p>The set of complex numbers (represented by the symbol <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(7).cgi" style="float:top;" border="0px">) is the sum of a real number and an imaginary number and has the form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(8).cgi" style="float:top;" border="0px">
</div>
<p>It could also be stated that all Real numbers are complex numbers with <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(9).cgi" style="float:top;" border="0px"> and all imaginary numbers are complex numbers with <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(10).cgi" style="float:top;" border="0px">.</p>
<span id="Adding_and_Subtracting_Complex_Numbers"><h2>Adding and Subtracting Complex Numbers</h2></span>
<p>Complex numbers can be added and subtracted by adding or subtracting the real, and imaginary parts.</p>
<p>Addition:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(11).cgi" style="float:top;" border="0px">
</div>
<p>Subtraction:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(12).cgi" style="float:top;" border="0px">
</div>
<span id="Multiply_a_Complex_Number_by_a_Scalar"><h2>Multiply a Complex Number by a Scalar</h2></span>
<p>A complex number is multiplied by a scalar by multiplying each term of the complex number by the scalar:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(13).cgi" style="float:top;" border="0px">
</div>
<span id="Product_of_Complex_Numbers"><h2>Product of Complex Numbers</h2></span>
<p>Complex numbers can also be multiplied by applying normal algebraic rules.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(14).cgi" style="float:top;" border="0px">
</div>
<span id="Square_of_Complex_Numbers"><h2>Square of Complex Numbers</h2></span>
<p>A complex number can also be squared by multiplying by itself:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(15).cgi" style="float:top;" border="0px">
</div>
<span id="Complex_Conjugate"><h2>Complex Conjugate</h2></span>
<p>The <strong>conjugate</strong> of a complex number is a complex number with the imaginary part negated and is denoted as either <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(16).cgi" style="float:top;" border="0px"> or <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(17).cgi" style="float:top;" border="0px">.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(18).cgi" style="float:top;" border="0px">
</div>
<p>The product of a complex number and its conjugate gives a special result.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(19).cgi" style="float:top;" border="0px">
</div>
<span id="Absolute_Value_of_a_Complex_Number"><h2>Absolute Value of a Complex Number</h2></span>
<p>We can use the <strong>conjugate</strong> of a complex number to compute the absolute value (or <strong>norm</strong>, or <strong>magnitude</strong>) of a complex number. The absolute value of a complex number is the square-root of the complex number multiplied by its <strong>conjugate</strong> and is denoted <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(20).cgi" style="float:top;" border="0px">:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(21).cgi" style="float:top;" border="0px">
</div>
<span id="Quotient_of_Two_Complex_Numbers"><h2>Quotient of Two Complex Numbers</h2></span>
<p>To compute the quotient of two complex numbers, we multiply the numerator and denominator by the complex conjugate of the denominator.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(22).cgi" style="float:top;" border="0px">
</div>
<span id="Powers_of_i"><h1>Powers of <em>i</em></h1></span>
<p>If we state that <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(3).cgi" style="float:top;" border="0px"> then it should be possible to raise <strong><em>i</em></strong> to other powers as well.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(23).cgi" style="float:top;" border="0px">
</div>
<p>If we keep writing this sequence, we will see a pattern emerge <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(24).cgi" style="float:top;" border="0px">.</p>
<p>A similar pattern emerges from the increasing negative powers.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(25).cgi" style="float:top;" border="0px">
</div>
<p>You may have seen a similar pattern in mathematics before but in the form <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(26).cgi" style="float:top;" border="0px"> which is generated by rotating a point 90 degrees counter-clockwise on a 2D Cartesian plane and the sequence <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(27).cgi" style="float:top;" border="0px"> is generated by rotating a point 90 degrees clockwise on a 2D Cartesian plane.</p>
<div id="attachment_2974" style="width: 782px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Cartesian-Plane.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Cartesian-Plane.png" alt="Cartesian Plane" title="Cartesian Plane" width="772" height="772" class="size-full wp-image-2974" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Cartesian-Plane-150x150.png 150w, http://www.3dgep.com/wp-content/uploads/2012/06/Cartesian-Plane-300x300.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Cartesian-Plane.png 772w" sizes="(max-width: 772px) 100vw, 772px"></a><p class="wp-caption-text">Cartesian Plane</p></div>
<span id="The_Complex_Plane"><h1>The Complex Plane</h1></span>
<p>We can also map complex numbers in a 2D grid called the <strong><a href="http://en.wikipedia.org/wiki/Complex_plane" title="Complex Plane" target="_blank">Complex Plane</a></strong> by mapping the <strong>Real</strong> part on the horizontal axis and the <strong>Imaginary</strong> part on the vertical axis.</p>
<div id="attachment_2976" style="width: 784px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Complex-Plane.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Complex-Plane.png" alt="Complex Plane" title="Complex Plane" width="774" height="774" class="size-full wp-image-2976" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Complex-Plane-150x150.png 150w, http://www.3dgep.com/wp-content/uploads/2012/06/Complex-Plane-300x300.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Complex-Plane.png 774w" sizes="(max-width: 774px) 100vw, 774px"></a><p class="wp-caption-text">Complex Plane</p></div>
<p>As shown in the previous sequence, we can say that if we multiply a complex number by <em>i</em>, we can rotate the complex number through the complex plane at 90 degree increments.</p>
<p>Let’s see if this is true. We’ll take an arbitrary point <strong>p</strong> in the complex plane:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(28).cgi" style="float:top;" border="0px">
</div>
<p>and we multiply it by <em>i</em> gives <strong>q</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(29).cgi" style="float:top;" border="0px">
</div>
<p>Multiplying <strong>q</strong> by <em>i</em> gives <strong>r</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(30).cgi" style="float:top;" border="0px">
</div>
<p>And multiplying <strong>r</strong> by <em>i</em> gives <strong>s</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(31).cgi" style="float:top;" border="0px">
</div>
<p>And multiplying <strong>s</strong> by <em>i</em> gives <strong>t</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(32).cgi" style="float:top;" border="0px">
</div>
<p>Which is exactly what we started with (<strong>p</strong>). If we plot these complex numbers on the complex plane, we get the following result.</p>
<div id="attachment_2985" style="width: 881px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Points-on-the-Complex-Plane.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Points-on-the-Complex-Plane.png" alt="Complex Numbers on the Complex Plane" title="Complex Numbers on the Complex Plane" width="871" height="871" class="size-full wp-image-2985" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Points-on-the-Complex-Plane-150x150.png 150w, http://www.3dgep.com/wp-content/uploads/2012/06/Points-on-the-Complex-Plane-300x300.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Points-on-the-Complex-Plane.png 871w" sizes="(max-width: 871px) 100vw, 871px"></a><p class="wp-caption-text">Complex Numbers on the Complex Plane</p></div>
<p>We can also rotate clock-wise in the complex plane by multiplying the complex number by <em><strong>-i</strong></em>.</p>
<span id="Rotors"><h2>Rotors</h2></span>
<p>We can also perform arbitrary rotations in the complex plane by defining a complex number of the form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(33).cgi" style="float:top;" border="0px">
</div>
<p>Multiplying any complex number by the rotor <strong>q</strong> produces the general formula:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(34).cgi" style="float:top;" border="0px">
</div>
<p>Which can also be written in matrix form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(35).cgi" style="float:top;" border="0px">
</div>
<p>Which is the method to rotate an arbitrary point in the complex plane counter-clockwise about the origin.</p>
<span id="Quaternions"><h1>Quaternions</h1></span>
<p>With this knowledge of the complex number system and the complex plane, we can extend this to 3-dimensional space by adding two imaginary numbers to our number system in addition to <em>i</em>.</p>
<p>The general form to express quaternions is</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(36).cgi" style="float:top;" border="0px">
</div>
<p>Were, according to Hamilton’s famous expression:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex.cgi" style="float:top;" border="0px">
</div>
<p>and</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(37).cgi" style="float:top;" border="0px">
</div>
<p>You may have noticed that the relationship between <em>i</em>, <em>j</em>, and <em>k</em> are very similar to the cross product rules for the unit cartesian vectors:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(38).cgi" style="float:top;" border="0px">
</div>
<p>Hamilton also recognized that the <em>i</em>, <em>j</em>, and <em>k</em> imaginary numbers could be used to represent three cartesian unit vectors <strong>i</strong>, <strong>j</strong>, and <strong>k</strong> with the same properties of imaginary numbers, such that <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(39).cgi" style="float:top;" border="0px">.</p>
<div id="attachment_3020" style="width: 1019px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Visualizing-the-properties-of-ij-jk-ki.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Visualizing-the-properties-of-ij-jk-ki.png" alt="Visualizing the properties of ij, jk, ki" title="Visualizing the properties of ij, jk, ki" width="1009" height="1009" class="size-full wp-image-3020" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Visualizing-the-properties-of-ij-jk-ki-150x150.png 150w, http://www.3dgep.com/wp-content/uploads/2012/06/Visualizing-the-properties-of-ij-jk-ki-300x300.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Visualizing-the-properties-of-ij-jk-ki.png 1009w" sizes="(max-width: 1009px) 100vw, 1009px"></a><p class="wp-caption-text">Visualizing the Properties of ij, jk, ki</p></div>
<p>The image above visualizes the relationship between the cartesian unit vectors represented by <strong>i</strong>, <strong>j</strong>, and <strong>k</strong>.</p>
<span id="Quaternions_as_an_Ordered_Pair"><h2>Quaternions as an Ordered Pair</h2></span>
<p>We can also represent quaternions as an ordered pair:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(40).cgi" style="float:top;" border="0px">
</div>
<p>Where <strong>v</strong> can also be represented by its individual components:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(41).cgi" style="float:top;" border="0px">
</div>
<p>Using this notation, we can more easily show the similarities between quaternions and complex numbers.</p>
<span id="Adding_and_Subtracting_Quaternions"><h2>Adding and Subtracting Quaternions</h2></span>
<p>Quaternions can be added and subtracted similar to complex numbers:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(42).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Products"><h2>Quaternion Products</h2></span>
<p>We can also express the product of two quaternions:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(43).cgi" style="float:top;" border="0px">
</div>
<p>Which results in another quaternion. If we replace the imaginary numbers <em>i</em>, <em>j</em>, and <em>k</em> in the previous expression by the ordered pairs (also known as the quaternion units),</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(44).cgi" style="float:top;" border="0px">
</div>
<p>And substituting back to the original expression together with <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(45).cgi" style="float:top;" border="0px"> gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(46).cgi" style="float:top;" border="0px">
</div>
<p>And expanding this expression into a sum of ordered pairs gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(47).cgi" style="float:top;" border="0px">
</div>
<p>If we multiply through with the quaternion unit and extract the common vector components, we can rewrite this equation in this way:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(48).cgi" style="float:top;" border="0px">
</div>
<p>This equation gives us the sum of two ordered pairs. The first ordered pair is a <strong>Real</strong> quaternion and the second is a <strong>Pure</strong> quaternion. These two ordered pairs can be combined into a single ordered pair:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(49).cgi" style="float:top;" border="0px">
</div>
<p>And if we substitute, </p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(50).cgi" style="float:top;" border="0px">
</div>
<p>We get:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(51).cgi" style="float:top;" border="0px">
</div>
<p>Which is the general equation of a quaternion product.</p>
<span id="A_Real_Quaternion"><h2>A Real Quaternion</h2></span>
<p>A <strong>Real</strong> Quaternion is a quaternion with a vector term of <strong>0</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(52).cgi" style="float:top;" border="0px">
</div>
<p>And the product of two <strong>Real</strong> Quaternions is another <strong>Real</strong> Quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(53).cgi" style="float:top;" border="0px">
</div>
<p>Which is similar to the product of two complex numbers that contain a zero imaginary term.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(54).cgi" style="float:top;" border="0px">
</div>
<span id="Multiplying_a_Quaternion_by_a_Scalar"><h2>Multiplying a Quaternion by a Scalar</h2></span>
<p>We can also multiply a quaternion by a scalar which should obey the rule:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(55).cgi" style="float:top;" border="0px">
</div>
<p>We can confirm this by using the product or <strong>Real</strong> Quaterions shown above to multiply a quaternion by the scalar as a <strong>Real</strong> Quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(56).cgi" style="float:top;" border="0px">
</div>
<span id="Pure_Quaternions"><h2>Pure Quaternions</h2></span>
<p>Similar to <strong>Real</strong> Quaterions, Hamilton also defined the <strong>Pure</strong> Quaternion as a quaternion that has a zero scalar term:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(57).cgi" style="float:top;" border="0px">
</div>
<p>Or, written in its component parts:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(58).cgi" style="float:top;" border="0px">
</div>
<p>And we can also take the product of two <strong>Pure</strong> quaternions:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(59).cgi" style="float:top;" border="0px">
</div>
<p>According to the quaternion product rule shown above.</p>
<span id="Additive_Form_of_a_Quaternion"><h2>Additive Form of a Quaternion</h2></span>
<p>We can also express quaternions as an addition of the <strong>Real</strong> and <strong>Pure</strong> quaternion parts:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(60).cgi" style="float:top;" border="0px">
</div>
<span id="Unit_Quaternion"><h2>Unit Quaternion</h2></span>
<p>Given an arbitrary vector <strong>v</strong>, we can express this vector in both its scalar magnitude and its direction as such:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(61).cgi" style="float:top;" border="0px">
</div>
<p>And combining this definition with the definition of a pure quaternion gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(62).cgi" style="float:top;" border="0px">
</div>
<p>And we can also describe a unit quaternion that has a zero scalar and a unit vector as such:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(63).cgi" style="float:top;" border="0px">
</div>
<span id="Binary_Form_of_a_Quaternion"><h2>Binary Form of a Quaternion</h2></span>
<p>We can now combine the definitions of the unit quaternion and the additive form of a quaternion, we can create a representation of quaternions which is similar to the notation used to describe complex numbers:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(64).cgi" style="float:top;" border="0px">
</div>
<p>This gives us a way to represent the quaternion that is very similar to complex numbers:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(65).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Conjugate"><h2>Quaternion Conjugate</h2></span>
<p>The quaternion conjugate can be computed by negating the vector part of the quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(66).cgi" style="float:top;" border="0px">
</div>
<p>And the product of a quaternion with its conjugate gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(67).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Norm"><h2>Quaternion Norm</h2></span>
<p>If you recall from the definition of the norm of a complex number:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(68).cgi" style="float:top;" border="0px">
</div>
<p>Similarly, the norm (or magnitude) of a quaternion is defined as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(69).cgi" style="float:top;" border="0px">
</div>
<p>Which allows us to express the norm of a quaternion as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(70).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Normalization"><h2>Quaternion Normalization</h2></span>
<p>With the definition of a quaternion norm, we can use it to normalize a quaternion. A quaternion is normalized by dividing it by <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(71).cgi" style="float:top;" border="0px">:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(72).cgi" style="float:top;" border="0px">
</div>
<p>As an example, let’s normalize the quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(73).cgi" style="float:top;" border="0px">
</div>
<p>First, we must compute the <strong>norm</strong> of the quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(74).cgi" style="float:top;" border="0px">
</div>
<p>Then, we must divide the quaternion by the norm of the quaternion to compute the normalized quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(75).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Inverse"><h2>Quaternion Inverse</h2></span>
<p>The inverse of a quaternion is denoted <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(76).cgi" style="float:top;" border="0px">. To compute the inverse of a quaternion, we take the conjugate of the quaternion and divide it by the square of the norm:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(77).cgi" style="float:top;" border="0px">
</div>
<p>To show this, we can take the fact that by definition of the inverse:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(78).cgi" style="float:top;" border="0px">
</div>
<p>And multiply both sides by the conjugate of the quaternion gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(79).cgi" style="float:top;" border="0px">
</div>
<p>And by substitution we get:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(80).cgi" style="float:top;" border="0px">
</div>
<p>And for unit-norm quaternions whose norm is 1, we can write:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(81).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Dot_Product"><h2>Quaternion Dot Product</h2></span>
<p>Similar to vector dot-products, we can also compute the dot product between two quaternions by multiplying the corresponding scalar parts and summing the results:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(82).cgi" style="float:top;" border="0px">
</div>
<p>We can also use the quaternion dot-product to compute the angular difference between the quaternions:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(83).cgi" style="float:top;" border="0px">
</div>
<p>And for unit-norm quaternions, we can simplify the equation:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(84).cgi" style="float:top;" border="0px">
</div>
<span id="Rotations"><h1>Rotations</h1></span>
<p>If you recall we defined a special form of the complex number called a <strong>Rotor</strong> that could be used to rotate a point through the 2D complex plane as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(33).cgi" style="float:top;" border="0px">
</div>
<p>Then by its similarities to complex numbers, it should be possible to express a quaternion that can be used to rotate a point in 3D-space as such:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(85).cgi" style="float:top;" border="0px">
</div>
<p>Let’s test if this theory holds by computing the product of the quaternion q and the vector <strong>p</strong>. First, we can express <strong>p</strong> as a <strong>Pure</strong> quaternion in the form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(86).cgi" style="float:top;" border="0px">
</div>
<p>And q is a unit-norm quaternion in the form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(87).cgi" style="float:top;" border="0px">
</div>
<p>Then,</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(88).cgi" style="float:top;" border="0px">
</div>
<p>We see that the result is a general quaternion with both a scalar and a vector parts.</p>
<p>Let’s first consider the “special” case where <strong>p</strong> is perpendicular to <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(89).cgi" style="float:top;" border="0px"> in which case, the dot-product term <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(90).cgi" style="float:top;" border="0px"> and the result becomes the <strong>Pure</strong> quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(91).cgi" style="float:top;" border="0px">
</div>
<p>In this case, to rotate <strong>p</strong> about <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(89).cgi" style="float:top;" border="0px"> we just substitute <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(92).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(93).cgi" style="float:top;" border="0px">.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(94).cgi" style="float:top;" border="0px">
</div>
<p>As an example, let’s rotate a vector <strong>p</strong> 45° about the z-axis then our quaternion <strong>q</strong> is:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(95).cgi" style="float:top;" border="0px">
</div>
<p>And let’s take a vector <strong>p</strong> that adheres to the special case that <strong>p</strong> is perpendicular to <strong>k</strong>:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(96).cgi" style="float:top;" border="0px">
</div>
<p>Now let’s find the product of qp:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(97).cgi" style="float:top;" border="0px">
</div>
<p>Which results in a <strong>Pure</strong> quaternion that is rotated 45° about the <strong>k</strong> axis.<br>
We can also confirm that the magnitude of the resulting vector is maintained:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(98).cgi" style="float:top;" border="0px">
</div>
<p>Which is exactly the result we expected!</p>
<p>We can visualize this by the following image:</p>
<div id="attachment_3143" style="width: 944px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-13.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-13.png" alt="Quaternion Rotation (1)" title="Quaternion Rotation (1)" width="934" height="763" class="size-full wp-image-3143" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Rotation-13-300x245.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Rotation-13-367x300.png 367w, http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Rotation-13.png 934w" sizes="(max-width: 934px) 100vw, 934px"></a><p class="wp-caption-text">Quaternion Rotation (1)</p></div>
<p>Now let’s consider a quaternion that is not orthogonal to <strong>p</strong>. If we specify the vector part of our quaternion to 45° offset from <strong>p</strong> we get:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(99).cgi" style="float:top;" border="0px">
</div>
<p>And multiplying our point <strong>p</strong> by <em>q</em> we get:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(100).cgi" style="float:top;" border="0px">
</div>
<p>And substituting <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(89).cgi" style="float:top;" border="0px">, <strong>p</strong> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(101).cgi" style="float:top;" border="0px"> gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(102).cgi" style="float:top;" border="0px">
</div>
<p>Which is no longer a <strong>pure</strong> quaternion, and it has not been rotated 45° and the vector’s norm is no longer 2 (instead it has been reduced to <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(103).cgi" style="float:top;" border="0px">).</p>
<p>This result can be visualized by the image.</p>
<div id="attachment_3146" style="width: 803px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-2.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-2.png" alt="Quaternion Rotation (2)" title="Quaternion Rotation (2)" width="793" height="763" class="size-full wp-image-3146"></a><p class="wp-caption-text">Quaternion Rotation (2)</p></div>
<div class="my-note">
Technically, it’s incorrect to represent the quaternion <strong>p’</strong> in 3D space because it’s actually a 4D vector! For the sake of simplicity, I will only visualize the vector component of quaternions.
</div>
<p>However, all is not lost. Hamilton recognized (but didn’t publish) that if we post-multiply the result of <em>qp</em> by the inverse of <em>q</em> then the result is a <strong>pure</strong> quaternion and the norm of the vector component is maintained. Let’s see if we can apply this to our example.</p>
<p>First, let’s compute <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(76).cgi" style="float:top;" border="0px">:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(104).cgi" style="float:top;" border="0px">
</div>
<p>For <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(101).cgi" style="float:top;" border="0px"> gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(105).cgi" style="float:top;" border="0px">
</div>
<p>And combining the previous value of <em>qp</em> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(76).cgi" style="float:top;" border="0px"> gives:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(106).cgi" style="float:top;" border="0px">
</div>
<p>Which is a <strong>pure</strong> quaternion and the norm of the result is:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(107).cgi" style="float:top;" border="0px">
</div>
<p>which is the same as <strong>p</strong> so the norm of the vector is maintained.</p>
<p>The image below visualizes the result of the rotation.</p>
<div id="attachment_3167" style="width: 803px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-3.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Rotation-3.png" alt="Quaternion Rotation (3)" title="Quaternion Rotation (3)" width="793" height="763" class="size-full wp-image-3167"></a><p class="wp-caption-text">Quaternion Rotation (3)</p></div>
<p>So we can see that the result is a pure quaternion and that the norm of the initial vector is maintained, but the vector has been rotated 90° rather than 45° which is twice as much as desired! So in order to correctly rotate a vector <strong>p</strong> by an angle <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(108).cgi" style="float:top;" border="0px"> about an arbitrary axis <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(89).cgi" style="float:top;" border="0px">, we must consider the half-angle and construct the following quaternion:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(109).cgi" style="float:top;" border="0px">
</div>
<p>Which is the general form of a rotation quaternion!</p>
<span id="Quaternion_Interpolation"><h1>Quaternion Interpolation</h1></span>
<p>One of the most important reasons for using quaternions in computer graphics is that quaternions are very good at representing rotations in space. Quaternions overcome the issues that plague other methods of rotating points in 3D space such as <a href="http://en.wikipedia.org/wiki/Gimbal_lock" title="Gimbal lock" target="_blank">Gimbal lock</a> which is an issue when you represent your rotation with eular angles.</p>
<p>Using quaternions, we can define several methods that represents a rotational interpolation in 3D space. The first method I will examine is called <strong>SLERP</strong> which is used to smoothly interpolate a point between two orientations. The second method is an extension of <strong>SLERP</strong> called <strong>SQAD</strong> which is used to interpolate through a sequence of orientations that define a path.</p>
<span id="SLERP"><h2>SLERP</h2></span>
<p><strong>SLERP</strong> stands for <strong>S</strong>pherical <strong>L</strong>inear Int<strong>erp</strong>olation. <strong>SLERP</strong> provides a method to smoothly interpolate a point about two orientations. </p>
<p>I will represent the first orientation as <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and the second orientation as <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px">. The point that is interpolated will be prepresented by <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(112).cgi" style="float:top;" border="0px"> and the interpolated point will be represented by <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(113).cgi" style="float:top;" border="0px">. The interpolation parameter <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(114).cgi" style="float:top;" border="0px"> will interpolate <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(112).cgi" style="float:top;" border="0px"> from <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> when <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(115).cgi" style="float:top;" border="0px"> to <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px"> when <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(116).cgi" style="float:top;" border="0px">.</p>
<p>The standard linear interpolation formula is:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(117).cgi" style="float:top;" border="0px">
</div>
<p>The general steps to apply this equation are:</p>
<ul>
<li>Compute the difference between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(118).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(119).cgi" style="float:top;" border="0px">.</li>
<li>Take the fractional part of that difference.</li>
<li>Adjust the original value by the fractional difference between the two points.</li>
</ul>
<p>We can use the same basic principle to interpolate between two quaternion orientations.</p>
<span id="Quaternion_Difference"><h3>Quaternion Difference</h3></span>
<p>The first step dictates that we must compute the difference between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px">. With regards to quaternions, this is equivalent to computing the angular difference between the two quaternions.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(120).cgi" style="float:top;" border="0px">
</div>
<span id="Quaternion_Exponentiation"><h3>Quaternion Exponentiation</h3></span>
<p>The next step is to take the fractional part of that difference. We can compute the fractional part of a quaternion by raising it to a power whose value is in the range 0…1.</p>
<p>The general formula for quaternion exponentiation is:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(121).cgi" style="float:top;" border="0px">
</div>
<p>Where the exponential function for quaternions is given by:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(122).cgi" style="float:top;" border="0px">
</div>
<p>And the logarithm of a quaternion is given by:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(123).cgi" style="float:top;" border="0px">
</div>
<p>For <strong>t=0</strong>, we have:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(124).cgi" style="float:top;" border="0px">
</div>
<p>And for <strong>t=1</strong>, we have:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(125).cgi" style="float:top;" border="0px">
</div>
<span id="Fractional_Difference_of_Quaternions"><h3>Fractional Difference of Quaternions</h3></span>
<p>And to compute the interpolated angular rotation, we adjust the original orientation <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and adjust it by the fractional part of the difference between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px">.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(126).cgi" style="float:top;" border="0px">
</div>
<p>Which is the general form of spherical linear interpolation using quaternions. However, this is not the form of the <strong>slerp</strong> equation that is commonly used in practice.</p>
<p>We can apply a similar formula for performing a spherical interpolation of vectors to quaternions. The general form of a spherical interpolation for vectors is defined as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(127).cgi" style="float:top;" border="0px">
</div>
<p>This is visualized in the following image.</p>
<div id="attachment_3209" style="width: 919px" class="wp-caption alignnone"><a href="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Interpolation2.png"><img src="./Understanding Quaternions3D Game Engine Programming_files/Quaternion-Interpolation2.png" alt="Quaternion Interpolation" title="Quaternion Interpolation" width="909" height="876" class="size-full wp-image-3209" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Interpolation2-300x289.png 300w, http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Interpolation2-311x300.png 311w, http://www.3dgep.com/wp-content/uploads/2012/06/Quaternion-Interpolation2.png 909w" sizes="(max-width: 909px) 100vw, 909px"></a><p class="wp-caption-text">Quaternion Interpolation</p></div>
<p>This formula can be applied unmodified to quaternions:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(128).cgi" style="float:top;" border="0px">
</div>
<p>And we can obtain the angle <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(108).cgi" style="float:top;" border="0px"> by computing the dot-product between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px">.</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(129).cgi" style="float:top;" border="0px">
</div>
<span id="Considerations"><h3>Considerations</h3></span>
<p>There are two issues with this implementation which must be taken into consideration during implementation.</p>
<p>First, if the quaternion dot-product results in a negative value, then the resulting interpolation will travel the “long-way” around the 4D sphere which is not necessarily what we want. To solve this problem, we can test the result of the dot product and if it is negative, then we can negate one of the orientations. Negating the scalar and the vector part of the quaternion does not change the orientation that it represents but by doing this we guarantee that the rotation will be applied in the “shortest” path.</p>
<p>The other problem arises when the angular difference between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px"> is very small then <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(130).cgi" style="float:top;" border="0px"> becomes 0. If this happens, then we will get an undefined result when we divide by <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(131).cgi" style="float:top;" border="0px">. In this case, we can fall-back to using linear interpolation between <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(110).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(111).cgi" style="float:top;" border="0px">. </p>
<span id="SQUAD"><h2>SQUAD</h2></span>
<p>Just as a <strong>SLERP</strong> can be used to compute an interpolation between two quaternions, a <strong>SQUAD</strong> (<strong>S</strong>pherical and <strong>Quad</strong>rangle) can be used to smoothly interpolate over a path of rotations.</p>
<p>If we have the sequence of quaternions:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(132).cgi" style="float:top;" border="0px">
</div>
<p>And we also define the “helper” quaternion (<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(133).cgi" style="float:top;" border="0px">) which we can consider an intermediate control point:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(134).cgi" style="float:top;" border="0px">
</div>
<p>Then the orientation along the sub-cuve defined by:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(135).cgi" style="float:top;" border="0px">
</div>
<p>at time <strong>t</strong> is given by:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(136).cgi" style="float:top;" border="0px">
</div>
<span id="Conclusion"><h1>Conclusion</h1></span>
<p>Besides being extremely difficult to understand, quaternions provide a few obvious advantages over using matrices or Euler angles for representing rotations.</p>
<ul>
<li>Quaternion interpolation using SLERP and SQUAD provide a way to interpolate smoothly between orientations in space.</li>
<li>Rotation concatenation using quaternions is faster than combining rotations expressed in matrix form.</li>
<li>For unit-norm quaternions, the inverse of the rotation is taken by subtracting the vector part of the quaternion. Computing the inverse of a rotation matrix is considerably slower if the matrix is not orthonormalized (if it is, then it’s just the transpose of the matrix).</li>
<li>Converting quaternions to matrices is slightly faster than for Euler angles.</li>
<li>Quaternions only require 4 numbers (3 if they are normalized. The Real part can be computed at run-time) to represent a rotation where a matrix requires at least 9 values.</li>
</ul>
<p>However for all of the advantages in favor of using quaternions, there are also a few disadvantages.</p>
<ul>
<li>Quaternions can become invalid because of floating-point round-off error however this “error creep” can be resolved by re-normalizing the quaternion.</li>
<li>And probably the most significant deterrent for using quaternions is that they are very hard to understand. I hope that this issue is resolved after reading this article.</li>
</ul>
<p>There are several math libraries that implement quaternions and a few of those libraries implement quaternions correctly. In my personal experience, I find <a href="http://glm.g-truc.net/" title="OpenGL Mathematics" target="_blank">GLM</a> (OpenGL Math Library) to be a good math library with a good implementation of quaternions. If you are interested in using quaternions in your own applications, this is the library I would recommend.</p>
<span id="Download_the_Demo"><h1>Download the Demo</h1></span>
<p>I created a small demo that demonstrates how a quaternion is used to rotate an object in space. The demo was created with <a href="http://unity3d.com/" title="Unity3D" target="_blank">Unity</a> 3.5.2 which you can <a href="http://unity3d.com/unity/download/" title="Download Unity" target="_blank">download for free</a> and view the demo script files. The zip file also contains a Windows binary executable but Using Unity, you can also generate a Mac application (and Unity 4 introduces Linux builds as well).</p>
<p><a href="https://docs.google.com/open?id=0B0ND0J8HHfaXdzM0dmdGUzBLV1U" title="Understanding Quaternions Demo" target="_blank">Understanding Quaternions.zip</a></p>
<span id="Reference"><h1>Reference</h1></span>
<table>
<tbody><tr>
<td><div id="attachment_3232" style="width: 209px" class="wp-caption alignleft"><a href="http://3dgep.com/wp-content/uploads/2012/06/Quaternions-for-Computer-Graphics.jpg"><img src="./Understanding Quaternions3D Game Engine Programming_files/Quaternions-for-Computer-Graphics-199x300.jpg" alt="Quaternions for Computer Graphics" title="Quaternions for Computer Graphics" width="199" height="300" class="size-medium wp-image-3232" srcset="http://www.3dgep.com/wp-content/uploads/2012/06/Quaternions-for-Computer-Graphics-199x300.jpg 199w, http://www.3dgep.com/wp-content/uploads/2012/06/Quaternions-for-Computer-Graphics.jpg 615w" sizes="(max-width: 199px) 100vw, 199px"></a><p class="wp-caption-text">Quaternions for Computer Graphics</p></div><br>
Vince, J (2011). Quaternions for Computer Graphics. 1st. ed. London: Springer.
</td><td>
</td></tr>
<tr>
<td><div id="attachment_583" style="width: 237px" class="wp-caption alignleft"><a href="http://3dgep.com/wp-content/uploads/2011/02/3D-Math-Primer-for-Graphics-and-Game-Development.jpg"><img src="./Understanding Quaternions3D Game Engine Programming_files/3D-Math-Primer-for-Graphics-and-Game-Development-227x300.jpg" alt="3D Math Primer for Graphics and Game Development" title="3D Math Primer for Graphics and Game Development" width="227" height="300" class="size-medium wp-image-583"></a><p class="wp-caption-text">3D Math Primer for Graphics and Game Development</p></div><br>
Dunn, F. and Parberry, I. (2002). 3D Math Primer for Graphics and Game Development. 1st. ed. Plano, Texas: Wordware Publishing, Inc.</td>
</tr>
<tr>
<td><a href="http://en.wikipedia.org/wiki/Quaternion" title="Quaternions" target="_blank">Quaternions – Wikipedia</a></td>
</tr>
<tr>
<td><a href="http://en.wikipedia.org/wiki/Quaternions_and_spatial_rotation" title="Quaternions and Spatial Rotations" target="_blank">Quaternions and Spatial Rotation – Wikipedia</a></td>
</tr>
</tbody></table>
<div class="shareaholic-canvas" data-app-id="8064284" data-app="share_buttons" data-title="Understanding Quaternions" data-link="http://www.3dgep.com/understanding-quaternions/" data-summary=""></div><div class="shareaholic-canvas" data-app-id="8064292" data-app="recommendations" data-title="Understanding Quaternions" data-link="http://www.3dgep.com/understanding-quaternions/" data-summary=""></div> </div> 
<footer class="entry-meta">
This entry was posted in <a href="http://www.3dgep.com/category/math/" rel="category tag">Math</a> and tagged <a href="http://www.3dgep.com/tag/3d/" rel="tag">3D</a>, <a href="http://www.3dgep.com/tag/complex/" rel="tag">complex</a>, <a href="http://www.3dgep.com/tag/graphics/" rel="tag">Graphics</a>, <a href="http://www.3dgep.com/tag/imaginary/" rel="tag">imaginary</a>, <a href="http://www.3dgep.com/tag/programming/" rel="tag">Programming</a>, <a href="http://www.3dgep.com/tag/quaternion/" rel="tag">quaternion</a>, <a href="http://www.3dgep.com/tag/rotations/" rel="tag">rotations</a>, <a href="http://www.3dgep.com/tag/rotors/" rel="tag">rotors</a>, <a href="http://www.3dgep.com/tag/slerp/" rel="tag">slerp</a>, <a href="http://www.3dgep.com/tag/squad/" rel="tag">squad</a> by <a href="http://www.3dgep.com/author/jeremiah/">Jeremiah van Oosten</a>. Bookmark the <a href="./Understanding Quaternions3D Game Engine Programming_files/Understanding Quaternions3D Game Engine Programming.html" title="Permalink to Understanding Quaternions" rel="bookmark">permalink</a>.
</footer> 
</article> 
<div id="comments">
<h2 id="comments-title">
45 thoughts on “<span>Understanding Quaternions</span>” </h2>
<ol class="commentlist">
<li class="comment even thread-even depth-1" id="li-comment-1020">
<article id="comment-1020" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/455c99453135d82874edc91533d64b32" srcset="http://1.gravatar.com/avatar/455c99453135d82874edc91533d64b32?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">lawrence brooks jr.</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1020"><time datetime="2012-06-28T21:31:20+00:00">June 28, 2012 at 9:31 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>I like this website.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1020#respond" onclick="return addComment.moveForm( &quot;comment-1020&quot;, &quot;1020&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to lawrence brooks jr.">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-1024">
<article id="comment-1024" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1024"><time datetime="2012-06-29T09:39:22+00:00">June 29, 2012 at 9:39 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thanks Lawrence, you comments are welcome.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1024#respond" onclick="return addComment.moveForm( &quot;comment-1024&quot;, &quot;1024&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-1027">
<article id="comment-1027" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/25f6926c1124bd6f5439638babedd28d?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/25f6926c1124bd6f5439638babedd28d?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn"><a href="http://www.cs.cmuedu/~dst" rel="external nofollow" class="url">Dave Touretzky</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1027"><time datetime="2012-06-30T18:11:16+00:00">June 30, 2012 at 6:11 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>This is a wonderfully clear and concise introduction to quaternions! There are a few typos that could be corrected. “It’s” should be “its” throughout. (The first is a contraction of “it is”, the second is the possessive form of “it”.) Also, “gimble’ should be “gimbal”. And “principal” should be “principle”: both are words but they have different meanings.</p>
<p>I will show this tutorial to all my robotics students.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1027#respond" onclick="return addComment.moveForm( &quot;comment-1027&quot;, &quot;1027&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Dave Touretzky">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-1033">
<article id="comment-1033" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1033"><time datetime="2012-07-02T10:00:49+00:00">July 2, 2012 at 10:00 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Dave,</p>
<p>Thanks for the corrections! Let me know if you find anything else.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1033#respond" onclick="return addComment.moveForm( &quot;comment-1033&quot;, &quot;1033&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-1030">
<article id="comment-1030" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/387e96f70291ddf46b7ab0b2f7f467de" srcset="http://0.gravatar.com/avatar/387e96f70291ddf46b7ab0b2f7f467de?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Gary</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1030"><time datetime="2012-07-01T17:33:38+00:00">July 1, 2012 at 5:33 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Well done! I find this website through google and found it very informative and useful. I would like to learn graphics programming for a long time, but it’s quite difficult to get started, especially the mathematics, may you kindly suggest what mathematics I should know and how to learn graphics programming effectively? Thank you very much.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1030#respond" onclick="return addComment.moveForm( &quot;comment-1030&quot;, &quot;1030&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Gary">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-1034">
<article id="comment-1034" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1034"><time datetime="2012-07-02T10:07:29+00:00">July 2, 2012 at 10:07 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Gary,</p>
<p>For basic graphics programming you will want to have a good understanding of vector algebra (vector addition &amp; subtraction, dot &amp; cross products) as well as matrix algebra (matrix products, inverse &amp; transpose). Also knowledge of basic lighting equations is important.</p>
<p>I recommend you read the books I’ve referenced in the math articles here: <a href="http://3dgep.com/?cat=27" title="Mathematics" rel="nofollow">http://3dgep.com/?cat=27</a> as well as read the the OpenGL articles here <a href="http://3dgep.com/?cat=11" title="Graphics Programming" rel="nofollow">http://3dgep.com/?cat=11</a>.</p>
<p>If you’d like to get into shader programming, then you should follow the Cg articles here: <a href="http://3dgep.com/?cat=108" title="Cg Shaders" rel="nofollow">http://3dgep.com/?cat=108</a>.</p>
<p>I also plan to make a set of GLSL articles, but I can’t promise when they will be ready.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1034#respond" onclick="return addComment.moveForm( &quot;comment-1034&quot;, &quot;1034&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-1389">
<article id="comment-1389" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/1b368b50d361f8232a3f4a4233f0118f" srcset="http://1.gravatar.com/avatar/1b368b50d361f8232a3f4a4233f0118f?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn"><a href="http://www.rockpocketgames.com/" rel="external nofollow" class="url">Trond</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1389"><time datetime="2012-11-28T13:59:44+00:00">November 28, 2012 at 1:59 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thank you for writing such a thorough post on quaternions, it is much appreciated! </p>
<p>Unfortunately though, quite a few of the equation listings don’t show properly in neither Firefox nor Chrome on my Win7 computer ( see <a href="http://grab.by/hQJm" rel="nofollow">http://grab.by/hQJm</a> for example). Just wanted to let you know <img src="./Understanding Quaternions3D Game Engine Programming_files/simple-smile.png" alt=":)" class="wp-smiley" style="height: 1em; max-height: 1em;"></p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1389#respond" onclick="return addComment.moveForm( &quot;comment-1389&quot;, &quot;1389&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Trond">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-1394">
<article id="comment-1394" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1394"><time datetime="2012-11-29T17:40:00+00:00">November 29, 2012 at 5:40 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thanks for pointing this out. A few weeks after creating this tutorial, the LaTeX generator I was using went offline and i had to switch to another provider. This provider seems to have a different parser than the one I was using when I created the page on quaternions in the first place. I switched again and some of the formulas that were not showing up before are fixed now but others are broken. I really need to install my own CGI handler for LaTex on my own server.</p>
<p>Thanks for the heads-up!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1394#respond" onclick="return addComment.moveForm( &quot;comment-1394&quot;, &quot;1394&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment even depth-3" id="li-comment-2231">
<article id="comment-2231" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/bcd66b5d7b915fda48a58f8852c1fe22?s=39&d=mm&r=g" srcset="http://2.gravatar.com/avatar/bcd66b5d7b915fda48a58f8852c1fe22?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn">Luke</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2231"><time datetime="2013-05-18T20:15:22+00:00">May 18, 2013 at 8:15 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>I find this to be a great tutorial but I’m having the same problem Trond had with every single equation, but the way it looks it seems to be a great tutorial.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2231#respond" onclick="return addComment.moveForm( &quot;comment-2231&quot;, &quot;2231&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Luke">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-4" id="li-comment-2679">
<article id="comment-2679" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2679"><time datetime="2013-08-20T17:39:53+00:00">August 20, 2013 at 5:39 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Luke,</p>
<p>I have moved the script that is used to generate the formulas to a new server. There have been some hiccups with this script but I hope to have them all fixed now.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2679#respond" onclick="return addComment.moveForm( &quot;comment-2679&quot;, &quot;2679&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
</ul> 
</li> 
</ul> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-1430">
<article id="comment-1430" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/7f3efa6880cb67fbd162f2f981f9a45b" srcset="http://1.gravatar.com/avatar/7f3efa6880cb67fbd162f2f981f9a45b?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Henry</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1430"><time datetime="2012-12-03T15:43:33+00:00">December 3, 2012 at 3:43 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>What happen for some picture of equation.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1430#respond" onclick="return addComment.moveForm( &quot;comment-1430&quot;, &quot;1430&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Henry">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-1466">
<article id="comment-1466" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1466"><time datetime="2012-12-06T12:44:30+00:00">December 6, 2012 at 12:44 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Henry, when I created this article I was using a different source for the LaTeX generation. That source has since become unavailable so I had to switch to another source which apparently handles LaTeX differently. I need to go through each equation which isn’t rendering correctly to find out why this is happening but this takes time… It will be fixed in the future.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1466#respond" onclick="return addComment.moveForm( &quot;comment-1466&quot;, &quot;1466&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-1967">
<article id="comment-1967" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/07b6ed349321cc79e106ffa849e8e653" srcset="http://0.gravatar.com/avatar/07b6ed349321cc79e106ffa849e8e653?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">paul jordan</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1967"><time datetime="2013-03-25T01:44:30+00:00">March 25, 2013 at 1:44 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>This is the only coherent introduction to quaternions I have found on the web. It is failry complex and I will have to read through this several times. I am assuming you are drawing heavily from Vince, as Dunn is pretty sketchy. Thanks for pulling this together–I feel like I have found a startting point!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1967#respond" onclick="return addComment.moveForm( &quot;comment-1967&quot;, &quot;1967&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to paul jordan">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-1979">
<article id="comment-1979" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/fc147f814e1473bb6105db3d924fb590" srcset="http://0.gravatar.com/avatar/fc147f814e1473bb6105db3d924fb590?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Sundaram RM</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-1979"><time datetime="2013-03-27T12:34:41+00:00">March 27, 2013 at 12:34 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Excellent tutorial/article on quaternions, it helped me get a good insight, thanks for the effort and this website is great!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=1979#respond" onclick="return addComment.moveForm( &quot;comment-1979&quot;, &quot;1979&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Sundaram RM">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-2013">
<article id="comment-2013" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/cac3af2521f47223989f676cfb071230" srcset="http://0.gravatar.com/avatar/cac3af2521f47223989f676cfb071230?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Brian Abraham</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2013"><time datetime="2013-04-01T14:00:15+00:00">April 1, 2013 at 2:00 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>While familiar with the use of rotational matrices all my previous attempts to get a hold of quaternions have failed.</p>
<p>What worked for me with your explanation is that you explained it by analogy to rotation in the complex plane which I already understood: the next step was then easy for me.</p>
<p>Many thanks for your work and making it available.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2013#respond" onclick="return addComment.moveForm( &quot;comment-2013&quot;, &quot;2013&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Brian Abraham">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-2194">
<article id="comment-2194" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/77b568a543609853d7a9ba8475624612" srcset="http://1.gravatar.com/avatar/77b568a543609853d7a9ba8475624612?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn"><a href="http://www.protoman.net/" rel="external nofollow" class="url">Shammah</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2194"><time datetime="2013-05-13T08:10:42+00:00">May 13, 2013 at 8:10 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Great tutorial, loving it so far!</p>
<p>I’ve spot one minor error I think though:<br>
&gt; The interpolation parameter t will interpolate P from q1 when t = 0 to q1 when t = 1.</p>
<p>Shouldn’t this be:<br>
&gt; The interpolation parameter t will interpolate P from q1 when t = 0 to q2 when t = 1.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2194#respond" onclick="return addComment.moveForm( &quot;comment-2194&quot;, &quot;2194&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Shammah">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor even depth-2" id="li-comment-2260">
<article id="comment-2260" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2260"><time datetime="2013-05-22T11:06:28+00:00">May 22, 2013 at 11:06 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Shammah,</p>
<p>Thanks for pointing this out!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2260#respond" onclick="return addComment.moveForm( &quot;comment-2260&quot;, &quot;2260&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-2302">
<article id="comment-2302" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/d3aec877539c0c0b926655073c2a7f6e" srcset="http://1.gravatar.com/avatar/d3aec877539c0c0b926655073c2a7f6e?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Felipe Tavares</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2302"><time datetime="2013-06-01T07:36:27+00:00">June 1, 2013 at 7:36 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>WOW! Very nice article. I actually implemented a simple quaternion library in C++ while reading it :). Very well presented too.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2302#respond" onclick="return addComment.moveForm( &quot;comment-2302&quot;, &quot;2302&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Felipe Tavares">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-2577">
<article id="comment-2577" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/834ffa50a1c8a0935a3df3c808de91df?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/834ffa50a1c8a0935a3df3c808de91df?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">mica barshap</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2577"><time datetime="2013-07-21T22:36:24+00:00">July 21, 2013 at 10:36 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Please it look like very importent&amp;impresive post, but you aware that we can’t read it becouse lack of picture? equations?<br>
Can you attach or sent a full pdf format to read it please?</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2577#respond" onclick="return addComment.moveForm( &quot;comment-2577&quot;, &quot;2577&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to mica barshap">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-2670">
<article id="comment-2670" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-2670"><time datetime="2013-08-20T13:59:09+00:00">August 20, 2013 at 1:59 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Mica,</p>
<p>Sorry if the formulas did not show up for you. The images for the formulas are generated on another sever than where the article itself is hosted. If the server that generates the images is inaccessible, then the formulas may not show up. This is annoying but if the images don’t show up, then check back in a few minutes and perhaps it is fixed at that time. I strive for 100% up-time, but some downtime is unavoidable.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=2670#respond" onclick="return addComment.moveForm( &quot;comment-2670&quot;, &quot;2670&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-3933">
<article id="comment-3933" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/4382d252d59f21852f809734a1da49ef" srcset="http://1.gravatar.com/avatar/4382d252d59f21852f809734a1da49ef?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Jannik</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-3933"><time datetime="2013-12-20T20:36:51+00:00">December 20, 2013 at 8:36 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thanks, this is actually really relevant to MA2 for first year students aswell.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=3933#respond" onclick="return addComment.moveForm( &quot;comment-3933&quot;, &quot;3933&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jannik">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-4559">
<article id="comment-4559" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/7c81a993925fc4bd105102066f5e5e20" srcset="http://1.gravatar.com/avatar/7c81a993925fc4bd105102066f5e5e20?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn"><a href="http://benvan.co.uk/" rel="external nofollow" class="url">Ben van Enckevort</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-4559"><time datetime="2014-03-22T15:22:01+00:00">March 22, 2014 at 3:22 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>This was fantastic! Thank you so much for writing it up.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=4559#respond" onclick="return addComment.moveForm( &quot;comment-4559&quot;, &quot;4559&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Ben van Enckevort">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-4827">
<article id="comment-4827" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/6a208c9612ff34395ca1f9fea953ea50" srcset="http://0.gravatar.com/avatar/6a208c9612ff34395ca1f9fea953ea50?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Gaz</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-4827"><time datetime="2014-04-12T16:08:58+00:00">April 12, 2014 at 4:08 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>This is a great explanation but I got really stuck at why the product of two quaternions is minus the dot product. We have:<br>
SaSb – XaXb – YaYb – ZaZb, then we substitute in that a.b = XaXbi^2 etc. Does this i^2 (i squared) not resolve to -1 as per Hamilton? That would make a.b equal to -XaXb – YaYb – ZaZb already and it wouldn’t need further negation. I’m obviously missing something in the notation, perhaps that i^2 here is the cosine of 0 and therefore equals 1. Confused!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=4827#respond" onclick="return addComment.moveForm( &quot;comment-4827&quot;, &quot;4827&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Gaz">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-25317">
<article id="comment-25317" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25317"><time datetime="2014-07-09T16:51:07+00:00">July 9, 2014 at 4:51 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Gaz,</p>
<p>You are right about the fact that <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(39).cgi" style="float:top;" border="0px"> as is stated in the section titled <a href="http://3dgep.com/?p=1815#Quaternions" title="Quaternions" rel="nofollow">Quaternions</a>.</p>
<p>Maybe if I write the product rule like this:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(137).cgi" style="float:top;" border="0px">
</div>
<p>And we can write the dot product of the vector parts of the two quaternions as:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(138).cgi" style="float:top;" border="0px">
</div>
<p>Which we can substitute back into the original equation:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(139).cgi" style="float:top;" border="0px">
</div>
<p>So we are not adding any extra negatives, we are just factoring out the <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(39).cgi" style="float:top;" border="0px"> from the dot-product to get the real part of the quaternion product.</p>
<p>Does this make it more clear?</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25317#respond" onclick="return addComment.moveForm( &quot;comment-25317&quot;, &quot;25317&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-4831">
<article id="comment-4831" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/91f821ec2ad7cf3101dfdaade130a11c" srcset="http://0.gravatar.com/avatar/91f821ec2ad7cf3101dfdaade130a11c?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Oskar</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-4831"><time datetime="2014-04-13T05:52:56+00:00">April 13, 2014 at 5:52 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Where it says:<br>
“The set of complex numbers (represented by the symbol ) is the sum of a real number and an imaginary number and has the form:”, the following formula is wrong. It should say: z = a + bi; a, b \in R; i^2 = -1, but it does not.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=4831#respond" onclick="return addComment.moveForm( &quot;comment-4831&quot;, &quot;4831&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Oskar">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-25309">
<article id="comment-25309" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25309"><time datetime="2014-07-09T15:24:08+00:00">July 9, 2014 at 3:24 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Oskar,</p>
<p>Yes, you are right. Thanks for pointing this out. After switching to a different LaTeX generator some formulas didn’t render correctly anymore. I hope I have fixed all of the places (in this page) where formulas were not rendered correctly anymore but if you seen any more then please let me know!</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25309#respond" onclick="return addComment.moveForm( &quot;comment-25309&quot;, &quot;25309&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-4832">
<article id="comment-4832" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/91f821ec2ad7cf3101dfdaade130a11c" srcset="http://0.gravatar.com/avatar/91f821ec2ad7cf3101dfdaade130a11c?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Oskar</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-4832"><time datetime="2014-04-13T05:56:02+00:00">April 13, 2014 at 5:56 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>… and in the following formulas, about addition, subtraction and multiplication, you should not use an implication arrow, you should use an equals sign.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=4832#respond" onclick="return addComment.moveForm( &quot;comment-4832&quot;, &quot;4832&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Oskar">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor odd alt depth-2" id="li-comment-25311">
<article id="comment-25311" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25311"><time datetime="2014-07-09T15:24:55+00:00">July 9, 2014 at 3:24 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Oskar,</p>
<p>Yes, again you are correct. I can’t remember why I had an implication arrow there but it’s fixed now.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25311#respond" onclick="return addComment.moveForm( &quot;comment-25311&quot;, &quot;25311&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-5005">
<article id="comment-5005" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/7f06dba5965530157d9b5bb0758e2edd" srcset="http://1.gravatar.com/avatar/7f06dba5965530157d9b5bb0758e2edd?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Titus</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-5005"><time datetime="2014-04-20T22:24:14+00:00">April 20, 2014 at 10:24 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thanks, this was really useful. I finally understood quaternions. I’ll use them in 3D reconstruction from multiple photos.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=5005#respond" onclick="return addComment.moveForm( &quot;comment-5005&quot;, &quot;5005&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Titus">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-21659">
<article id="comment-21659" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/d8a6d670b65a8a5aac7a114084f991f6" srcset="http://1.gravatar.com/avatar/d8a6d670b65a8a5aac7a114084f991f6?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Henning</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-21659"><time datetime="2014-06-02T15:25:29+00:00">June 2, 2014 at 3:25 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thanks for the article. Found an error in the formulas after: “Complex numbers can also be multiplied by applying normal algebraic rules.”</p>
<p>In row three there stand a2a2 where it should be a1a2.</p>
<p>Bye</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=21659#respond" onclick="return addComment.moveForm( &quot;comment-21659&quot;, &quot;21659&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Henning">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor even depth-2" id="li-comment-25290">
<article id="comment-25290" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25290"><time datetime="2014-07-09T12:24:11+00:00">July 9, 2014 at 12:24 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Henning,</p>
<p>Thanks for pointing this out. I have fixed the article now.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25290#respond" onclick="return addComment.moveForm( &quot;comment-25290&quot;, &quot;25290&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-24170">
<article id="comment-24170" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/2c58af6b010d87d565770452a4d1e783?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/2c58af6b010d87d565770452a4d1e783?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">gabriel</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-24170"><time datetime="2014-06-12T01:32:07+00:00">June 12, 2014 at 1:32 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>This article it’s just beautiful. Thank you.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=24170#respond" onclick="return addComment.moveForm( &quot;comment-24170&quot;, &quot;24170&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to gabriel">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-odd thread-alt depth-1" id="li-comment-24628">
<article id="comment-24628" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/32a3ecd7bd0d84f0709eef1c75f864ec" srcset="http://0.gravatar.com/avatar/32a3ecd7bd0d84f0709eef1c75f864ec?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">cubase01</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-24628"><time datetime="2014-06-23T07:39:35+00:00">June 23, 2014 at 7:39 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>beautiful article.<br>
I suggest you try mathjax.js for equation generation. It`s client-based. no need for host or anything.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=24628#respond" onclick="return addComment.moveForm( &quot;comment-24628&quot;, &quot;24628&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to cubase01">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-24721">
<article id="comment-24721" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/756dbaac120d73123ea71a7dbc710a2f" srcset="http://1.gravatar.com/avatar/756dbaac120d73123ea71a7dbc710a2f?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">akash</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-24721"><time datetime="2014-06-25T23:49:02+00:00">June 25, 2014 at 11:49 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>i have a doubt. when u calculate the norms int the example, u said, instead of 2 its is root(3). but how is it?? sqrt(1 + 2 + 1) = srt(4) = 2 ???</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=24721#respond" onclick="return addComment.moveForm( &quot;comment-24721&quot;, &quot;24721&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to akash">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor even depth-2" id="li-comment-25288">
<article id="comment-25288" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25288"><time datetime="2014-07-09T12:13:06+00:00">July 9, 2014 at 12:13 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Akash,</p>
<p>In the example we are rotating the vector <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(140).cgi" style="float:top;" border="0px"> 45° by the quaternion <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(141).cgi" style="float:top;" border="0px"> but in order to perform this operation, we must express <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(112).cgi" style="float:top;" border="0px"> as a <strong>pure</strong> quaternion in the form <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(86).cgi" style="float:top;" border="0px">. (notice how vectors are expressed use bold-face characters and quaternions are expressed as normal (not bold) characters).</p>
<p>If the quaternion <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(142).cgi" style="float:top;" border="0px"> correctly rotated the vector <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(112).cgi" style="float:top;" border="0px"> then the result should also be a <strong>pure</strong> quaternion (with no scalar part) and the magnitude of the <strong>vector part</strong> should be the same as the original vector (because a rotation should not scale the original vector) however this example shows that this is not the case.</p>
<p>The magnitude of the original vector is</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(143).cgi" style="float:top;" border="0px">
</div>
<p>But the magnitude of the <strong>vector part</strong> of the resulting quaternion is:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(144).cgi" style="float:top;" border="0px">
</div>
<p>Which is not the same magnitude as the original vector.</p>
<p>If I wanted to compute the magnitude of the resulting <strong>quaternion</strong> then I would need to consider the quaternion’s scalar part according to the formula described in the section titled <a href="http://3dgep.com/?p=1815#Quaternion_Norm" title="Quaternion Norm" rel="nofollow">Quaternion Norm</a>. But since I’m only interested in rotating a vector by a quaternion I only want to consider the result of the vector part (and thus discard the scalar part when I compute the magnitude of the resulting vector).</p>
<p>I hope this answers your question.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25288#respond" onclick="return addComment.moveForm( &quot;comment-25288&quot;, &quot;25288&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-25053">
<article id="comment-25053" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/32a3ecd7bd0d84f0709eef1c75f864ec" srcset="http://0.gravatar.com/avatar/32a3ecd7bd0d84f0709eef1c75f864ec?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">cubase01</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25053"><time datetime="2014-07-05T16:39:02+00:00">July 5, 2014 at 4:39 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>and I have a question.what`s that suppose to mean? </p>
<p>if a+bi is a point,isn`t that a Matrix multipy a point equals to a point more correct?</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25053#respond" onclick="return addComment.moveForm( &quot;comment-25053&quot;, &quot;25053&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to cubase01">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor even depth-2" id="li-comment-25301">
<article id="comment-25301" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25301"><time datetime="2014-07-09T14:42:23+00:00">July 9, 2014 at 2:42 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>cubase01,</p>
<p>Sorry, the matrix representation of a complex number is not explained in this article. I will try to briefly explain it here.</p>
<p>We can represent a complex number as the matrix <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(145).cgi" style="float:top;" border="0px"> which is the sum of two other matrices representing the real <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(146).cgi" style="float:top;" border="0px"> and the imaginary <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(147).cgi" style="float:top;" border="0px"> parts (note that bold, upper-case characters represent matrices):</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(148).cgi" style="float:top;" border="0px">
</div>
<p>Which can also be expressed in the more familiar form of the complex number:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(149).cgi" style="float:top;" border="0px">
</div>
<p>where <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(150).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(151).cgi" style="float:top;" border="0px">.</p>
<p>The matrix equivalent of 1 is the 2 x 2 identity matrix:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(152).cgi" style="float:top;" border="0px">
</div>
<p>And as was mentioned in the section titled <a href="http://3dgep.com/?p=1815#Powers_of_i" title="Powers of i" rel="nofollow">Powers of i</a> the imaginary component <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(4).cgi" style="float:top;" border="0px"> can be treated as a 90° counter-clockwise rotation in the complex plane which can also be represented by a rotation matrix:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(153).cgi" style="float:top;" border="0px">
</div>
<p>Now we can express the complex number in matrix form:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(154).cgi" style="float:top;" border="0px">
</div>
<p>So what you see in the section titled <a href="http://3dgep.com/?p=1815#Rotors" title="Rotors" rel="nofollow">Rotors</a> is the matrix form of a complex number and the <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(155).cgi" style="float:top;" border="0px"> and <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(156).cgi" style="float:top;" border="0px"> are the real and imaginary parts of a complex number and rotating a complex number (represented in matrix form) by the 2×2 counter-clockwise rotation matrix produces another complex number (represented in matrix form).</p>
<p>It is also interesting to note that if we express the equation <img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(3).cgi" style="float:top;" border="0px"> in matrix form we get:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(157).cgi" style="float:top;" border="0px">
</div>
<p>which verifies that the square of the imaginary number is -1.</p>
<p>I hope this helps.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25301#respond" onclick="return addComment.moveForm( &quot;comment-25301&quot;, &quot;25301&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment odd alt thread-even depth-1" id="li-comment-25080">
<article id="comment-25080" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/53acd66e86c7eb89d9632a9912c01b9f?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/53acd66e86c7eb89d9632a9912c01b9f?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Carlo Wood</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25080"><time datetime="2014-07-06T15:43:34+00:00">July 6, 2014 at 3:43 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>I think there’s a little typo in <a href="http://3dgep.com/?p=1815#Quaternion_Dot_Product" rel="nofollow">http://3dgep.com/?p=1815#Quaternion_Dot_Product</a><br>
It should be q1q2, not q12.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25080#respond" onclick="return addComment.moveForm( &quot;comment-25080&quot;, &quot;25080&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Carlo Wood">Reply <span>↓</span></a> </div> 
</article> 
<ul class="children">
<li class="comment byuser comment-author-jeremiah bypostauthor even depth-2" id="li-comment-25280">
<article id="comment-25280" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/00f2d6dcb1d4602c73bb571194789ab0" srcset="http://0.gravatar.com/avatar/00f2d6dcb1d4602c73bb571194789ab0?s=78&amp;d=mm&amp;r=g 2x" class="avatar avatar-39 photo" height="39" width="39"><span class="fn"><a href="http://3dgep.com/" rel="external nofollow" class="url">Jeremiah van Oosten</a></span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-25280"><time datetime="2014-07-09T10:55:32+00:00">July 9, 2014 at 10:55 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Carlo,</p>
<p>Thanks for pointing this out. It should actually be:</p>
<div align="center">
<img src="./Understanding Quaternions3D Game Engine Programming_files/mathtex(158).cgi" style="float:top;" border="0px">
</div>
<p>I recently switched LaTeX engines. The new one seems to be a bit more picky about separating parts of the equation for correct rendering.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=25280#respond" onclick="return addComment.moveForm( &quot;comment-25280&quot;, &quot;25280&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Jeremiah van Oosten">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ul> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-27042">
<article id="comment-27042" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/7d57c6c1a22e8e5dd3ddd28e108e7dff" srcset="http://1.gravatar.com/avatar/7d57c6c1a22e8e5dd3ddd28e108e7dff?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Nicolas DAVID</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-27042"><time datetime="2014-07-27T18:58:02+00:00">July 27, 2014 at 6:58 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thank you ! THANK YOU ! this is an awesome website you made, and while the subjects are technical, they remain accessible… thanks again !</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=27042#respond" onclick="return addComment.moveForm( &quot;comment-27042&quot;, &quot;27042&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Nicolas DAVID">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-28783">
<article id="comment-28783" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/57b72eb0d75a80f044dbc202be4e3b5e?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/57b72eb0d75a80f044dbc202be4e3b5e?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">PrudiiArca</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-28783"><time datetime="2014-08-21T18:55:17+00:00">August 21, 2014 at 6:55 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Thank you sooo much for this explanation! I searched for good ones in the web for nearly a month and this is far the best and most detailed I read. Now I can implement Quaternion rotation without shaming me for not knowing the stuff I am using…</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=28783#respond" onclick="return addComment.moveForm( &quot;comment-28783&quot;, &quot;28783&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to PrudiiArca">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-30454">
<article id="comment-30454" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/eca2c76bc68c2846516cfcc57f4f2f61?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/eca2c76bc68c2846516cfcc57f4f2f61?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">lexluger0</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-30454"><time datetime="2014-09-06T23:28:37+00:00">September 6, 2014 at 11:28 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>A very very very good explanation on quaternions. This is awesome. Well done <img src="./Understanding Quaternions3D Game Engine Programming_files/simple-smile.png" alt=":)" class="wp-smiley" style="height: 1em; max-height: 1em;"></p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=30454#respond" onclick="return addComment.moveForm( &quot;comment-30454&quot;, &quot;30454&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to lexluger0">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-41069">
<article id="comment-41069" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/9d8d5e74cf107c3c58ea25171f06d066" srcset="http://0.gravatar.com/avatar/9d8d5e74cf107c3c58ea25171f06d066?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Daniel Huber</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-41069"><time datetime="2015-02-25T22:57:07+00:00">February 25, 2015 at 10:57 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>Many thanks for this extraordinary introduction into quaternions.<br>
I really appreciate this work!<br>
Thank you.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=41069#respond" onclick="return addComment.moveForm( &quot;comment-41069&quot;, &quot;41069&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Daniel Huber">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment odd alt thread-odd thread-alt depth-1" id="li-comment-41647">
<article id="comment-41647" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="http://2.gravatar.com/avatar/e35e81070b93883529788906a8f0f862?s=68&d=mm&r=g" srcset="http://2.gravatar.com/avatar/e35e81070b93883529788906a8f0f862?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Matt</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-41647"><time datetime="2015-03-11T01:10:21+00:00">March 11, 2015 at 1:10 am</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>You don’t know how many sites I went to trying to find good explanations of Quaternions before ending up here. Keep up the magnificent work. =3</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=41647#respond" onclick="return addComment.moveForm( &quot;comment-41647&quot;, &quot;41647&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Matt">Reply <span>↓</span></a> </div> 
</article> 
</li> 
<li class="comment even thread-even depth-1" id="li-comment-46485">
<article id="comment-46485" class="comment">
<footer class="comment-meta">
<div class="comment-author vcard">
<img alt="" src="./Understanding Quaternions3D Game Engine Programming_files/357a20e8c56e69d6f9734d23ef9517e8" srcset="http://0.gravatar.com/avatar/357a20e8c56e69d6f9734d23ef9517e8?s=136&amp;d=mm&amp;r=g 2x" class="avatar avatar-68 photo" height="68" width="68"><span class="fn">Mom, I know quaternion now!</span> on <a href="http://www.3dgep.com/understanding-quaternions/#comment-46485"><time datetime="2015-09-07T17:26:33+00:00">September 7, 2015 at 5:26 pm</time></a> <span class="says">said:</span>
</div> 
</footer>
<div class="comment-content"><p>HANDS DOWN. The best tutorial of quaternion ever. It’s step-by-step, ordered from easy to hard, with simple figures.</p>
</div>
<div class="reply">
<a rel="nofollow" class="comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/?replytocom=46485#respond" onclick="return addComment.moveForm( &quot;comment-46485&quot;, &quot;46485&quot;, &quot;respond&quot;, &quot;1815&quot; )" aria-label="Reply to Mom, I know quaternion now!">Reply <span>↓</span></a> </div> 
</article> 
</li> 
</ol>
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="http://www.3dgep.com/understanding-quaternions/#respond" style="display:none;">Cancel reply</a></small></h3> <form action="http://www.3dgep.com/wp-comments-post.php" method="post" id="commentform" class="comment-form">
<p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> Required fields are marked <span class="required">*</span></p><p class="comment-form-comment"><label for="comment">Comment</label> <textarea id="comment" name="comment" cols="45" rows="8" aria-required="true" required="required"></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" aria-required="true" required="required"></p>
<p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="text" value="" size="30" aria-describedby="email-notes" aria-required="true" required="required"></p>
<p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="text" value="" size="30"></p>
<p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment"> <input type="hidden" name="comment_post_ID" value="1815" id="comment_post_ID">
<input type="hidden" name="comment_parent" id="comment_parent" value="0">
</p><p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="b96c603306"></p><p style="display: none;"></p> <input type="hidden" id="ak_js" name="ak_js" value="1461485948139"></form>
</div> 
</div> 
</div> 
</div> 
</div> 
<footer id="colophon" role="contentinfo">
<div id="supplementary" class="two">
<div id="first" class="widget-area" role="complementary">
<aside id="text-3" class="widget widget_text"> <div class="textwidget"><a href="http://made.nhtv.nl/" title="my Academy for Digital Entertainment">
<img src="./Understanding Quaternions3D Game Engine Programming_files/MADE-logo-320x90.gif" width="320" height="89"></a>
</div>
</aside> </div> 
<div id="third" class="widget-area" role="complementary">
<aside id="text-4" class="widget widget_text"> <div class="textwidget"><a href="http://www.nhtv.nl/ENG/home.html" title="Breda University of Applied Sciences">
<img src="./Understanding Quaternions3D Game Engine Programming_files/NHTV-logo-300x90.gif" width="158" height="90" align="right">
</a>
</div>
</aside> </div> 
</div> 
<div id="site-generator">
<a href="http://wordpress.org/" title="Semantic Personal Publishing Platform">Proudly powered by WordPress</a>
</div>
</footer> 
</div> 
 <script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/form.js"></script><iframe id="SHR-2551" frameborder="0" style="display: none;"></iframe>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/jquery.prettyPhoto.min.js"></script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/comment-reply.min.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
var MTBrushParams = {"baseUrl":"http:\/\/www.3dgep.com\/wp-content\/plugins\/syntax-highlighter-mt"};
/* ]]> */
</script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/brushTypes.js"></script>
<script type="text/javascript" src="./Understanding Quaternions3D Game Engine Programming_files/wp-embed.min.js"></script>
<script>
jQuery(function($) {
$('a[rel^="prettyPhoto"]').prettyPhoto();
});
</script>


 </body></html>